<template>
  <div>
    <head-cont></head-cont>
    <section class="prod-main">
      <div class="banner"></div>
      <div class="trainer-wrap">
        <div class="trainer">
          <h2>基于视觉AI算法的姿态矫正云计算的交互界面机器人</h2>
          <div class="text">
            本产品是一款基于视觉AI算法的姿态矫正云计算的交互界面机器人。本产品的主要应用在羽毛球场馆中，其中核心内容是满足无球训练，
            对学员的无球动作进行采集，比对样本库中的无球动作然后给出分数或者是定格正确动作，帮助学员和教练员更快熟悉和掌握羽毛球动作，
            减轻教练员的工作压力，增加学员的学习趣味性和学习积极性。
          </div>
          <div class="info-ioc">
            <img src="../../assets/image/icon2/2.png" alt="">
          </div>
        </div>
      </div>
      <div class="func-wrap">
        <div class="func pos-rel">
          <h2>
            <span class="title">两大功能，让运动变得简单</span>
            <span class="main">训练模块<i></i>测试模块</span>
          </h2>
          <section class="train">
            <h3>训练模块</h3>
            <img src="../../assets/image/icon2/3.png" alt="">
            <div class="text">
              通过查看动作示范进行星级动作训练，摄像头采集这些动作实时进行反馈，
              让学员可以很快知道自己到底什么动作是有问题的，实时进行调整，最终定格动作。
            </div>
          </section>
          <section class="test">
            <h3>测试模块</h3>
            <div class="right"><img src="../../assets/image/icon2/4.png" alt=""></div>
            <div class="text">
              学员浏览动作，然后就星级动作进行测试，测试动作被拍摄后上传到服务器，与服务器样本库动作进行比对，
              然后会得出这组动作的分数。学员可以通过查看自己的分数记录来检查自己的动作到底是哪个部位做的还不够好。
            </div>
          </section>
        </div>
      </div>
      <section class="product-info clearfix">
        <div class="fl">
          <span>更超薄，更轻便</span>
          <span class="then">机身长约610mm(加上支架1381mm)</span>
          <span>宽约348mm 厚度约为56mm</span>
          <span>30万像素清晰成像</span>
          <span>23.6英寸大屏幕，分辨率：1080*1920</span>
          <span class="then">画面清晰才更有意义</span>
        </div>
        <div class="fl info-bg1"></div>
        <div class="fl info-bg2"></div>
        <div class="fl">
          <span>更超薄，更轻便</span>
          <span class="then">机身长约610mm(加上支架1381mm)</span>
          <span>宽约348mm 厚度约为56mm</span>
          <span>30万像素清晰成像</span>
          <span>23.6英寸大屏幕，分辨率：1080*1920</span>
          <span class="then">画面清晰才更有意义</span>
        </div>
      </section>
    </section>
    <foot-cont></foot-cont>
  </div>
</template>
<script>
import headCont from '@/components/header'
import footCont from '@/components/footer/foot2'
export default {
  components:{
    headCont,
    footCont
  }
}
</script>
<style scoped>
  .banner{
    height:550px;
    min-width:1200px;
    background: url('../../assets/image/icon2/1.jpg') no-repeat center center;
  }
  .trainer{
    width:1200px;
    height:766px;
    margin: 0 auto;
    padding:43px 0;
    box-sizing: border-box;
  }
  .trainer h2{
    font-size: 30px;
    line-height: 140px;
    color:#666;
  }
  .trainer .text{
    width:660px;
    height:168px;
    padding:0 14px;
    box-sizing: border-box;
    font-size: 14px;
    line-height: 24px;
    color:#848383;
    text-indent: 18px;
  }
  .trainer-wrap{
    min-width: 1200px;
    background: url('../../assets/image/icon2/1.png') no-repeat center center;
  }
  .func-wrap{
    padding:50px 0;
    min-width:1200px;
    height:766px;
    box-sizing: border-box;
    background: url('../../assets/image/icon2/6.png') no-repeat center center;
  }
  .func{
    width: 1200px;
    margin: 0 auto;
  }
  .func h2 span{
    display: block;
    text-align: center;
    line-height: 50px;
  }
  .func .title{
    font-size: 30px;
    color: #666;
  }
  .func .main{
    font-size: 20px;
    color: #999;
    vertical-align: center;
  }
  .func .main i{
    display: inline-block;
    width:2px;
    height:20px;
    background-color: #999;
    margin:0 30px;
  }
  .func .text{
    width:380px;
    font-size: 14px;
    line-height: 24px;
    color:#666;
    text-indent: 20px;
  }
  .func section h3{
    font-size: 24px;
    line-height: 60px;
    color: #535252;
  }
  .func img{
    margin:10px 0;
  }
  .train{
    position: absolute;
    top:140px;
    left:0;
  }
  .test{
    position: absolute;
    right:0;
    top:320px;
  }
  .right{
    text-align: right;
  }
  .product-info{
    width:1200px;
    height:766px;
    margin:0 auto;
  }
  .product-info .fl{
    width:600px;
    height:382px;
    padding:50px 0;
    box-sizing: border-box;
    text-align: center;
  }
  .product-info .fl span{
    display: block;
    font-size: 18px;
    line-height: 30px;
    color:#666;
  }
  .product-info .fl .then{
    font-size: 24px;
    line-height: 52px;
    color:#333;
    letter-spacing:5px;
  }
  .info-bg1{
    background: url('../../assets/image/icon2/7.png') no-repeat;
  }
  .info-bg2{
    background: url('../../assets/image/icon2/8.png') no-repeat;
  }
</style>
